<style lang="less">
    @import './index.less';
</style>

<template>
  <div>
    <Card dis-hover>
      <Row v-show="searchList" class="margin-bottom-8">
        <i-col span="17">
          <Input placeholder="合同编号" size="small" style="width: 200px" v-model="searchInfo.contract_number"></Input>
          <Button class="margin-right-5" type="primary" size="small" icon="ios-search" @click="searchHandle">搜索</Button>
          <Button type="primary" size="small" icon="arrow-down-b" @click="searchListControl">高级搜索</Button>
        </i-col>
        <i-col span="7">
            <add-btn class="pull-right" @addclick="addTicketHandle"></add-btn>
        </i-col>
      </Row>
      <div v-show="!searchList" class="margin-bottom-8">
        <Row :gutter="10">
          <i-col span="4">
            <Input  size="small" placeholder="合同编号" v-model="searchInfo.contract_number"></Input>
          </i-col>
          <i-col span="4">
            <Select v-model="searchInfo.customer_id"  placeholder="客户名称" size="small" clearable>
              <Option v-for="(item,index) in companyList" :value="item.customer_id" :key="index">{{item.customer_name}}</Option>
            </Select>
          </i-col>
          <i-col span="4">
            <DatePicker type="daterange" ref="entrydates" size="small" placeholder="开票日期范围" placement="bottom-end" @on-change="getDates"></DatePicker>
          </i-col>
          <i-col span="5">
            <Button class="margin-right-5" type="primary" size="small" icon="ios-search" @click="searchHandle">搜索</Button>
            <Button type="primary" size="small" @click="searchListControl" icon="arrow-up-b">收起</Button> 
          </i-col>
          <i-col span="7">
            <add-btn class="pull-right" @addclick="addTicketHandle"></add-btn>
          </i-col>
        </Row>
      </div>
      <Table :columns="ticketColumns" :data="ticketData.data"></Table>
      <Page :current="currentPage" :total="totalCount" :page-size="pageSize" show-total @on-change="changepage"></Page>
    </Card>
    <Modal v-model="modalControl" 
        :title="modalTitle" 
        width="1000" 
        :loading="loading"
        @on-cancel="cancel('formValidate')">
      <Form :model="modalForm" ref="formValidate" :rules="formValidateRules"  :label-width="110" label-position="right">
        <Row>
          <i-col span="9" offset="2">
            <FormItem label="发票名称" prop="invoice_title">
              <Input v-model="modalForm.invoice_title"></Input>
            </FormItem>
          </i-col>
          <i-col span="9" offset="2">
            <FormItem label="申请日期">
              <DatePicker type="date" placement="bottom-end" disabled v-model="modalForm.apply_date"></DatePicker>
            </FormItem>
          </i-col>
        </Row>
        <Row>
          <i-col span="9" offset="2">
            <FormItem label="开据发票类型" prop="invoice_type">
              <Select clearable  v-model="modalForm.invoice_type">
                <Option value="增值税普通发票">增值税普通发票</Option>
                <Option value="增值税专用发票">增值税专用发票</Option>
              </Select>
            </FormItem>
          </i-col>
          <i-col span="9" offset="2">
            <FormItem label="开票日期" prop="invoice_date">
              <DatePicker type="date" placement="bottom-start" ref="invoiceDate" transfer v-model="modalForm.invoice_date"></DatePicker>
            </FormItem>
          </i-col>
        </Row>
        <div class="division-tips">
          <Button type="text" icon="arrow-up-b" v-show="customerRow" @click="customerRow = !customerRow"></Button>
          <Button type="text" icon="arrow-down-b" v-show="!customerRow" @click="customerRow = !customerRow"></Button>
          <span>开票单位信息</span>
        </div>
        <div v-show="customerRow">
            <Row>
              <i-col span="9" offset="2">
                <FormItem label="客户名称" prop="customer_id">
                  <Select v-model="modalForm.customer_id" transfer filterable @on-change="getContracts">
                    <Option v-for="item in companyList" :key="item.contract_id" :value="item.customer_id">{{item.customer_name}}</Option>
                  </Select>
                </FormItem>
              </i-col>
              <i-col span="9" offset="2">
                <FormItem label="客户地址">
                  <Input disabled v-model="companyInfo.address"></Input>
                </FormItem>
              </i-col>
            </Row>
            <Row>
              <i-col span="9" offset="2">
                <FormItem label="纳税人识别号">
                  <Input disabled v-model="companyInfo.tax_num"></Input>
                </FormItem>
              </i-col>
              <i-col span="9" offset="2">
                <FormItem label="客户电话">
                  <Input disabled v-model="companyInfo.phone_num"></Input>
                </FormItem>
              </i-col>
            </Row>
            <Row>
              <i-col span="9" offset="2">
                <FormItem label="开户行账号">
                  <Input disabled v-model="companyInfo.bank_account"></Input>
                </FormItem>
              </i-col>
              <i-col span="9" offset="2">
                <FormItem label="开户行">
                  <Input disabled v-model="companyInfo.bank"></Input>
                </FormItem>
              </i-col>
            </Row>
        </div>
        <div class="division-tips">
          <Button type="text" icon="arrow-up-b" v-show="contractRow" @click="contractRow = !contractRow"></Button>
          <Button type="text" icon="arrow-down-b" v-show="!contractRow" @click="contractRow = !contractRow"></Button>
          <span>开票合同信息</span>
        </div>
        <div v-show="contractRow">
            <Row>
              <i-col span="9" offset="2">
                <FormItem label="合同编号" prop="contract_id">
                  <Select v-model="modalForm.contract_id" transfer filterable @on-change="getContractInfo">
                    <Option v-for="item in contractList" :key="item.contract_id" :value="item.contract_id">{{item.contract_number}}</Option>
                  </Select>
                </FormItem>
              </i-col>
              <i-col span="9" offset="2">
                <FormItem label="合同金额">
                  <Input disabled v-model="contractInfo.contract_amount"></Input>
                </FormItem>
              </i-col>
            </Row>
            <Row>
              <i-col span="9" offset="2">
                <FormItem label="签约时间">
                  <Input disabled v-model="contractInfo.contract_date"></Input>
                </FormItem>
              </i-col>
              <i-col span="9" offset="2">
                <FormItem label="合同时间">
                  <Input disabled v-model="contractInfo.contract_start_date"></Input>
                </FormItem>
              </i-col>
            </Row>
            <Row>
              <i-col span="9" offset="2">
                <FormItem label="累计回款金额">
                  <Input disabled v-model="contractInfo.historyPayment"></Input>
                </FormItem>
              </i-col>
              <i-col span="9" offset="2">
                <FormItem label="累计开票金额">
                  <Input disabled v-model="contractInfo.historyInvoice"></Input>
                </FormItem>
              </i-col>
            </Row>
            <Row>
              <i-col span="9" offset="2">
                <FormItem label="合同负责人">
                  <Input disabled v-model="contractInfo.responsible_name"></Input>
                </FormItem>
              </i-col>
            </Row>
        </div>
        <div class="division-tips">
          <Button type="text" icon="arrow-up-b" v-show="ticketRow" @click="ticketRow = !ticketRow"></Button>
          <Button type="text" icon="arrow-down-b" v-show="!ticketRow" @click="ticketRow = !ticketRow"></Button>
          <span>开票项目</span>
        </div>
        <div v-show="ticketRow">
          <Row>
            <i-col span="6">
              <FormItem label="名称" prop="item_type">
                <Select transfer v-model="modalForm.item_type">
                  <Option v-for="item in this.indexData.invoiceProType" :key="item.value" :value="item.value">{{item.label}}</Option>
                </Select>
              </FormItem>
            </i-col>
            <i-col span="6">
              <FormItem label="数量" prop="item_count">
                <InputNumber :min="1" v-model="modalForm.item_count"></InputNumber>
              </FormItem>
            </i-col>
            <i-col span="6" pull="1">
              <FormItem label="单价(元)" prop="price">
                <Input v-model="modalForm.price"></Input>
              </FormItem>
            </i-col>
            <i-col span="6" pull="1">
              <FormItem label="开票金额(元)" prop="invoice_amount">
                <Input v-model="modalForm.invoice_amount"></Input>
              </FormItem>
            </i-col>
          </Row>
          <can-edit-table 
              class="margin-bottom-10"
              v-model="receivables"
              @on-cell-change="handleCellChange" 
              :editIncell="editIncell" 
              :columns-list="indexData.modalColumns"
          ></can-edit-table>
          <Row slot="content" class="margin-bottom-10">
            <i-col span="3" offset="21">
              <h3>总计：{{totalSum}} 元</h3>
            </i-col>
          </Row>
        </div>
        <div class="division-tips">
          <Button type="text" icon="arrow-up-b" v-show="addressRow" @click="addressRow = !addressRow"></Button>
          <Button type="text" icon="arrow-down-b" v-show="!addressRow" @click="addressRow = !addressRow"></Button>
          <span>开票邮寄地址</span>
        </div>
        <div v-show="addressRow">
            <Row>
              <i-col span="9" offset="2">
                <FormItem label="收件人">
                  <Input v-model="modalForm.receiver"></Input>
                </FormItem>
              </i-col>
              <i-col span="9" offset="2">
                <FormItem label="联系电话">
                  <Input v-model="modalForm.phone_num"></Input>
                </FormItem>
              </i-col>
            </Row>
            <Row>
              <i-col span="9" offset="2">
                <FormItem label="邮寄地址">
                  <Input v-model="modalForm.address"></Input>
                </FormItem>
              </i-col>
              <i-col span="9" offset="2">
                <FormItem label="邮政编码">
                  <Input v-model="modalForm.postcode"></Input>
                </FormItem>
              </i-col>
            </Row>
        </div>
      </Form>
      <div slot="footer">
          <Button type="ghost" size="large" @click="save('formValidate')">保存</Button>
          <Button type="primary" size="large"  @click="check('formValidate')">提交审核</Button>
      </div>
    </Modal>
  </div>
</template>

<script>
import moment from "moment";
import addBtn from './component/access-add-button.vue';
import deleteBtn from './component/access-delete-button.vue';
import modifyBtn from './component/access-modify-button.vue';
import checkBtn from './component/access-check-button.vue';
import canEditTable from './component/canEditTable.vue';

import indexData from './index_data.js';


export default {
    data () {
      var valideNumber = (rule, value, callback) => {
        if(!Number.isInteger(+value)) {
           callback(new Error('请输入数字值'));
        }else {
          callback()
        }
      };
      return {
        indexData: [],
        // 分页
        contract_id:'',
        contract_number:'',
        customer_id:'',
        start:'',
        end:'',
        currentPage:1,
        pageSize:15,
        totalCount:0,
        userName:'',
        searchList:true,
        editIncell:true,
        modalControl:false,
        loading:true,
        okText:'',
        modalTitle:'',
        totalSum:0,
        customerRow:true,
        contractRow:true,
        addressRow:true,
        ticketRow:true,
        modalForm:{
          apply_date:new Date(),
          item_count:1,
          invoice_amount:'0',
          price:'0',
          receivableinvoices:[],
        },
        searchInfo:{
          contract_number:'',
          customer_id:'',
          start:'',
          end:''
        },
        flow:[],
        ticketData:[],
        companyList:[],
        contractList:[],
        receivables:[],
        companyInfo:{},
        contractInfo:{},
        formValidateRules:{
          contract_id:[{ required: true, message: '请选择合同', trigger: 'change' }],
          customer_id:[{ required: true, message: '请选择客户', trigger: 'change' }],
          invoice_title:[{ required: true, message: '请输入发票名称', trigger: 'change' }],
          invoice_date:[{type:'date', required: true, message: '请输入开票日期', trigger: 'blur' }],
          invoice_type:[{ required: true, message: '请选择发票类型', trigger: 'change' }],
          invoice_amount:[{ required: true, message: '请输入开票金额', trigger: 'change' },{ validator: valideNumber , trigger: 'change'}],
          item_type:[{ required: true, message: '请选择开票项目名称', trigger: 'change' }],
          price:[{ required: true, message: '请输入开票项目单价', trigger: 'change' },{ validator: valideNumber , trigger: 'change'}],
          item_count:[{ type:'number', required: true, message: '请输入开票项目数量', trigger: 'change' }],
        },
        ticketColumns:[
          {
            title:'名称',
            align:'center',
            key:'invoice_title'
          },{
            title:'税票类型',
            align:'center',
            key:'item_type'
          },{
            title:'开票金额(元)',
            align:'center',
            key:'invoice_amount'
          },{
            title:'开票日期',
            align:'center',
            key:'invoice_date'
          },{
            title:'对应客户',
            align:'center',
            key:'customer_name'
          },{
            title:'合同编号',
            align:'center',
            key:'contract_number'
          },{
            title:'客户经理',
            align:'center',
            key:'responsible_name'
          },
          {
          title:'合同状态',
          key:'status',
          align:'center',
          render:(h,params) => {
            if(params.row.status === '草稿') {
              return h('span',{
                style:{
                  color:'#ed3f14'
                }
              },params.row.status)
            }else {
              return h('Poptip', {
                  props: {
                      trigger: 'hover',
                      title: this.flow.length + '条审核记录',
                      placement: 'bottom-end'
                  }
              }, [
                  h('span', {
                    on:{
                      mouseenter:() => {
                        this.getFlow(params.row.invoice_id)
                      }
                    }
                  },params.row.status),
                  h('div', {
                      slot: 'content'
                  }, [
                      h('ul', this.flow.map(item => {
                          return h('li', {
                              style: {
                                  textAlign: 'center',
                                  padding: '4px'
                              }
                          }, item.approvalDate + '：' +item.approvalUserId + item.action + ',' + '审核意见：' + item.comment);
                      }))
                  ])
              ]);
            }
          }
        },
          {
          title:'操作',
          align:'center',
          render:(h,params) => {
            // 合同申请人如果不是登陆用户，该登陆用户只能查看其在权限范围内的合同详情
            if(params.row.creator !== this.userName) {
              return h('Poptip', {
                props:{
                  trigger:'hover',
                  placement:'left',
                }
              },[
                h('Button',{
                  props:{
                    type:'text',
                    size:'small',
                    icon:'ios-color-wand',
                  }
                }),
                h('div',{
                  slot:'content',
                },[
                  h('Button',{
                    props:{
                      type:'info',
                      size:'small',
                      //icon:'qr-scanner'
                    },
                    style:{
                      marginRight:'5px',
                    }, 
                    on:{
                      click:() => {
                        this.$router.push({
                          name:'ticket_my-ticket-detail',
                          params:{id:params.row.invoice_id}
                        })
                      }
                    }
                  },'详细信息')
                ])
              ])
            }else {
              return h('Poptip', {
                props:{
                  trigger:'hover',
                  placement:'left',
                }
              },[
                h('Button',{
                  props:{
                    type:'text',
                    size:'small',
                    icon:'ios-color-wand',
                  }
                }),
                h('div',{
                  slot:'content',
                },[
                  h('Button',{
                    props:{
                      type:'info',
                      size:'small',
                    },
                    style:{
                      marginRight:'5px',
                    }, 
                    on:{
                      click:() => {
                        this.$router.push({
                          name:'ticket_my-ticket-detail',
                          params:{id:params.row.invoice_id}
                        })
                      }
                    }
                  },'详细信息'),
                  h(checkBtn,{
                    props:{
                      status:params.row.status
                    },
                    on: {
                      checkclick:() => {
                        this.$Modal.confirm({
                          title: '确认',
                          content: '确认要提交【' + params.row.invoice_title + '】的发票审核吗？',
                          onOk: () => {
                            this.checkHandle(params.row);
                          }
                        });
                      }
                    }
                  },'提交审核'),
                  h(modifyBtn,{
                    props:{
                      status:params.row.status
                    },
                    on: {
                      modifyClick: () => {
                        this.modifyHandle(params.row.invoice_id)
                      }
                    }
                  },'修改'),
                  h(deleteBtn,{
                    props:{
                      status:params.row.status
                    },
                    on: {
                      delclick:() => {
                        this.$Modal.confirm({
                          title: '确认',
                          content: '确认要删除发票信息吗？',
                          onOk: () => {
                            this.delete(params.row.invoice_id);
                          }
                        });
                      }
                    }
                  })
                ])
              ])
            }
          }
        }],
      }
    },
    methods: {
      getTickets() {
        this.$http.get('/fi/invoices/page?contract_id=&contract_number='+this.searchInfo.contract_number+'&customer_id='+this.searchInfo.customer_id+'&start='+this.searchInfo.start+'&end='+this.searchInfo.end+'&currenPage='+this.currentPage+'&pageSize='+this.pageSize)
        .then((res) => {
          this.ticketData = res.data.returnValue
          this.totalCount = res.data.returnValue.totalCount
        })
      },
      changepage(page) {
        this.currentPage = page
        this.getTickets()
      },
      // 公司
      getCompanys() {
        this.$http.get('/fi/customer/customers').then((res) => {
          this.companyList = res.data.returnValue
        })
      },
      // 公司下的合同
      getContracts(value) {
        // 客户详情
        this.$http.get('/customer/customers/' + value).then((res) => {
          this.companyInfo = res.data.returnValue
        })
        //合同
        this.$http.get('/fi/contracts?like=&customer_id=' + value + '&org_id=&responsible=&status=').then((res) => {
          this.contractList = res.data.returnValue
        })
      },
      // 选中的合同的相关信息
      getContractInfo(value) {
        this.$http.get('/fi/contracts/' + value).then((res) => {
          this.contractInfo = res.data.returnValue
          this.receivables = res.data.returnValue.receivables
          this.$set(this.contractInfo,'historyPayment',0) // 累计回款金额
          this.$set(this.contractInfo,'historyInvoice',0) // 累计开票金额

          // 遍历计算累计回款金额
          _.forEach(this.contractInfo.receivables,item => {
            _.forEach(item.receivableBackpayments,r=> {
              this.contractInfo.historyPayment = this.contractInfo.historyPayment + r.amount
            })
          })
          // 遍历计算累计开票金额
          _.forEach(this.contractInfo.invoices,item => {
            if(item.status === '审核通过') {
              this.contractInfo.historyInvoice = this.contractInfo.historyInvoice + item.invoice_amount
            }
          })
          // 新建
          if(!this.modalForm.invoice_id) {
            // 遍历计算每个应收期次对应的开票金额和未开票金额
            _.forEach(this.receivables,item => { // table绑定的是this.receivables
              this.$set(item,'invoiceSum',0) // 已开票金额
              this.$set(item,'invoiceSub',item.receivable_amount) // 未开票金额
              this.$set(item,'amount',0) //本次申请开票金额
              _.forEach(this.contractInfo.invoices,i => {
                if(i.status === '审核通过') {
                  _.forEach(i.receivableinvoices,r => {
                    if(item.receivable_id === r.receivable_id) {
                      item.invoiceSum = item.invoiceSum + r.amount
                      item.invoiceSub = item.receivable_amount - item.invoiceSum
                    }
                  })
                }
              })
            })
          // 修改
          }else {
            _.forEach(this.receivables,item => {
              this.$set(item,'invoiceSum',0),
              this.$set(item,'invoiceSub',item.receivable_amount),
              this.$set(item,'amount',0)
              _.forEach(this.modalForm.receivableinvoices,i => {
                if(item.receivable_id === i.receivable_id) {
                  item.invoiceSum = item.invoiceSum + i.amount
                  item.invoiceSub = item.receivable_amount - item.invoiceSum
                  item.amount = i.amount
                  this.totalSum = this.totalSum + item.amount
                }
              })
            })
          }
        })
      },
      getInvoiceInfo(id) {
        this.$http.get('/fi/invoices/' + id).then((res) => {
          this.modalForm = res.data.returnValue
          this.modalForm.apply_date = this.modalForm.create_time.split(' ')[0]
          this.modalForm.invoice_amount = this.modalForm.invoice_amount.toString()
          this.modalForm.item_count = parseFloat(this.modalForm.item_count)
        })
      },
      addTicketHandle() {
        this.modalTitle = "申请发票"
        this.getCompanys()
        this.modalControl= true
      },
      modifyHandle(id) {
        this.modalTitle = "修改发票信息"
        this.getInvoiceInfo(id)
        this.getCompanys()
        this.modalControl = true
      },
      handleParams() {
        delete this.modalForm.apply_date
        delete this.modalForm.customer_id
        this.modalForm.status = "草稿"
        this.modalForm.invoice_date = moment(this.modalForm.invoice_date).format('YYYY-MM-DD')
        _.forEach(this.receivables,(item,index) => {
          this.modalForm.receivableinvoices.push({})
          this.modalForm.receivableinvoices[index].receivable_id = item.receivable_id
          this.modalForm.receivableinvoices[index].amount = item.amount
        })
      },
      save(name) {
        this.$refs[name].validate((valid) => {
          // 验证表单
          if(valid) {
            // 验证金额
            if(this.totalSum === parseFloat(this.modalForm.invoice_amount)) {
              this.handleParams()
              // 判断业务主键
              if(!this.modalForm.invoice_id) {
                this.$http.post('/fi/invoices',this.modalForm).then((res) => {
                  this.$Message.success(res.data.message)
                  this.cleanParams(name)
                  this.getTickets()
                }).catch((res) => {
                  this.$Message.error(res.data.message)
                })
              }else {
                let arr = _.map(this.receivables,item => {
                  return {receivable_id:item.receivable_id,amount:item.amount}
                })
                var info = {
                  invoice_id: this.modalForm.invoice_id,
                  contract_id:this.modalForm.contract_id,
                  invoice_title:this.modalForm.invoice_title,
                  invoice_date:this.modalForm.invoice_date,
                  invoice_type:this.modalForm.invoice_type,
                  invoice_amount:this.modalForm.invoice_amount,
                  item_type:this.modalForm.item_type,
                  item_count:this.modalForm.item_count,
                  price:this.modalForm.price,
                  status:this.modalForm.status,
                  receiver:this.modalForm.receiver,
                  phone_num:this.modalForm.phone_num,
                  address:this.modalForm.address,
                  postcode:this.modalForm.postcode,
                  receivableinvoices:arr
                }
                this.$http.put('/fi/invoices',info).then((res) => {
                  this.$Message.success(res.data.message)
                  this.cleanParams(name)
                  this.getTickets()
                })
              }
            }else {
              this.$Message.info('本次申请发票总金额与每期累计申请发票金额不相等，请确认申请金额')
              this.reloading()
            }
          }else {
            this.$Message.info('请检查所有必填项')
            this.reloading()
          }
        })
      },
      check(name) {
        var _this = this
        _this.$refs[name].validate((valid) => {
          // 表单验证
          if(valid) {
            // 验证金额
            if(_this.totalSum === parseFloat(_this.modalForm.invoice_amount)) {
              _this.handleParams() // 处理数据的方法
              // 判断业务主键
              if(!_this.modalForm.invoice_id) {
                return new Promise((resolve,reject) => {
                  _this.$http.post('/fi/invoices',this.modalForm).then((res) => {
                    resolve(res.data.returnValue)
                  })
                }).then(function (invoice_id) {
                  return new Promise((resolve,reject) => {
                    _this.$http.get('/fi/invoices/' + invoice_id).then((res) => {
                      resolve(res.data.returnValue)
                    })
                  })
                }).then(function (invoiceInfo) {
                  _this.checkHandle(invoiceInfo)
                })
              }else{
                _this.checkHandle(_this.modalForm)
              }
            }else {
              _this.$Message.info('本次申请发票总金额与每期累计申请发票金额不相等，请确认申请金额')
              _this.reloading()
            }
          }else {
            _this.$Message.info('请检查所有必填项')
            _this.reloading()
          }
        })
      },
      checkHandle(data) {
        var info = {
          category: 'invoice-approval',
          businessKey:data.invoice_id,
          form:data
        }
        if(data.status === '草稿')  {
          this.$flowHttp.post('/flow/create',info).then((res) => {
            this.$Message.success('审核已提交！')
            this.modalControl = false
            this.cleanParams('formValidate')
            this.getTickets()
          }).catch(() => {
            this.$Message.error('审核提交失败，请稍后重试！')
          })
        }else if(data.status === '审核驳回') {
          this.$flowHttp.post('/flow/submit',info).then((res) => {
            this.$Message.success('被驳回审核已提交！')
            this.modalControl = false
            this.cleanParams('formValidate')
            this.getTickets()
          }).catch(() => {
            this.$Message.error('审核提交失败，请稍后重试！')
          })
        }
      },
      delete(id) {
        this.$http.delete('/fi/invoices/' + id).then((res) => {
          this.$Message.success(res.data.message)
          this.getTickets()
        }).catch((err) => {
          this.$Message.error(err.message)
        })
      },
      getDates(date) {
        this.searchInfo.start = date[0]
        typeof(date[1]) != "undefined" ? this.searchInfo.end = date[1]:this.end = ''
      },
      searchHandle() {
        this.getTickets()
      },
      searchListControl() {
        this.searchList = !this.searchList
        this.searchInfo = {
          contract_number:'',
          customer_id:'',
          start:'',
          end:''
        }
        this.getTickets()
      },
      cancel(name) {
        this.cleanParams(name)
      },
      cleanParams(name) {
        this.$refs.invoiceDate.handleClear() // 清空datepicker 
        this.$refs[name].resetFields() // 清空表单验证提示
        this.receivables = []
        this.modalControl = false
        this.totalSum = 0
        this.modalForm = {
          apply_date:new Date(),
          item_count:1,
          invoice_amount:'0',
          price:'0',
          receivableinvoices:[],
        }
      },
      reloading() {
        this.loading = false
        this.$nextTick(() => {
          this.loading = true
        })
      },
      handleCellChange (val, index, key) {
        this.totalSum = 0 
        _.forEach(val,item => {
          this.totalSum = this.totalSum + item.amount
        })
      },
      getFlow(id) {
        this.$flowHttp.get('/flow/history?category=invoice-approval&key=' + id).then((res) => {
          this.flow = res.data.returnValue
        })
      }
    },
    components: {
      addBtn,
      deleteBtn,
      modifyBtn,
      checkBtn,
      canEditTable
    },
    mounted() {
      this.getTickets()
      this.getCompanys()
      this.userName = this.$auth.user().name
    },
    created () {
    this.indexData = indexData
  }
}
</script>

